@charset "UTF-8";
* {
  margin: 0;
  padding: 0;
  list-style: none;
  text-decoration: none;
  box-sizing: border-box;
}

html, body, #root, #app {
  width: 100%;
  height: 100%;
}

.home, .dingdan, .wode {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
}

.tabbar, .header {
  width: 100%;
  height: 50px;
  text-align: center;
  line-height: 50px;
  display: flex;
  z-index: 11;
  background: #fff;
}

.tabbar a, .header a {
  flex: 1;
}

.tabbar .router-link-exact-active, .header .router-link-exact-active {
  color: #0080ff;
}

.header {
  justify-content: space-around;
}

.tabbar {
  border-top: 1px solid #ccc;
}

.content {
  flex: 1;
}

.banner {
  width: 100%;
  height: 100px;
}

.banner .swiper-wrapper {
  width: 100%;
  height: 100px;
}

.banner .swiper-wrapper img {
  width: 100%;
  height: 100%;
}

/* 我的页面 */
.wode .content {
  width: 100%;
  height: 100%;
}

.wode .content .user {
  width: 100%;
  height: 100px;
  display: flex;
}

.wode .content .user .img {
  height: 100%;
  padding: 10px;
}

.wode .content .user .img img {
  height: 100%;
}

.wode .content .user .text {
  padding: 30px 15px;
}

.wode .content .yhq {
  width: 100%;
  height: 100px;
  padding: 0 10px;
}

.wode .content .yhq img {
  width: 100%;
  height: 100%;
}

.wode .content .list {
  padding: 0 20px;
}

.wode .content .list .item {
  display: flex;
  justify-content: space-between;
  width: 100%;
  height: 50px;
  line-height: 50px;
  border-bottom: 1px solid #eee;
}

.input-box {
  width: 100%;
  height: 40px;
  display: flex;
  padding: 2px 10px;
}

.input-box input {
  flex: 1;
  padding-left: 10px;
}

.search .item {
  display: flex;
  padding: 5px 20px;
}

.search .item .img {
  width: 80px;
  height: 80px;
}

.search .item .text {
  padding: 5px 10px;
  flex: 1;
  text-align: left;
  font-size: 12px;
  line-height: 18px;
}

.search .item .text .qs {
  display: flex;
  justify-content: space-between;
}

.search .item .text .mj {
  margin-top: 3px;
}

.search .item .text .mj span {
  border: 1px solid salmon;
  padding: 1px 6px;
  margin: 0 2px;
  border-radius: 2px;
  color: salmon;
}

/* 首页 */
.home .list {
  height: 467px;
  width: 100%;
}

.home .list .navbar {
  width: 100%;
  height: 40px;
  display: flex;
}

.home .list .navbar span {
  flex: 1;
  text-align: center;
  line-height: 40px;
}

.home .list .navbar span.active {
  border-bottom: 2px solid red;
}

.home .list .navys {
  width: 100%;
  display: flex;
  justify-content: space-around;
  margin-top: 5px;
}

.home .list .navys span {
  border-radius: 5px;
  padding: 4px 8px;
  background: #eee;
}

.home .list .lists {
  overflow: auto;
  height: 392px;
  width: 100%;
  margin-top: 5px;
  padding-top: 5px;
}

.home .list .lists .item {
  display: flex;
  padding: 5px 20px;
}

.home .list .lists .item .img {
  width: 80px;
  height: 80px;
}

.home .list .lists .item .text {
  padding: 5px 10px;
  flex: 1;
  text-align: left;
  font-size: 12px;
  line-height: 18px;
}

.home .list .lists .item .text .qs {
  display: flex;
  justify-content: space-between;
}

.home .list .lists .item .text .mj {
  margin-top: 3px;
}

.home .list .lists .item .text .mj span {
  border: 1px solid salmon;
  padding: 1px 6px;
  margin: 0 2px;
  border-radius: 2px;
  color: salmon;
}

.wodesc {
  width: 100%;
  height: 100%;
}

.wodesc .list {
  width: 100%;
  height: 617px;
  overflow: auto;
  margin-top: 5px;
  padding-top: 5px;
}

.wodesc .list .item {
  display: flex;
  padding: 5px 20px;
}

.wodesc .list .item .img {
  width: 80px;
  height: 80px;
}

.wodesc .list .item .text {
  padding: 5px 10px;
  flex: 1;
  text-align: left;
  font-size: 12px;
  line-height: 18px;
}

.wodesc .list .item .text .qs {
  display: flex;
  justify-content: space-between;
}

.wodesc .list .item .text .mj {
  margin-top: 3px;
}

.wodesc .list .item .text .mj span {
  border: 1px solid salmon;
  padding: 1px 6px;
  margin: 0 2px;
  border-radius: 2px;
  color: salmon;
}

.header img {
  width: 20px;
}

.detail {
  width: 100%;
  height: 100%;
}

.detail .detaillist {
  width: 100%;
  height: 567px;
  display: flex;
}

.detail .detaillist .left {
  width: 25%;
  height: 100%;
  background: #ccc;
  display: flex;
  flex-direction: column;
}

.detail .detaillist .left .item {
  width: 100%;
  height: 50px;
  text-align: center;
  line-height: 50px;
}

.detail .detaillist .right {
  overflow: auto;
  width: 75%;
  height: 100%;
  background: pink;
}

.detail .detaillist .right .item {
  display: flex;
  padding: 20px 10px;
  border-bottom: 1px solid #000;
  position: relative;
}

.detail .detaillist .right .item .btn {
  position: absolute;
  bottom: 20px;
  right: 20px;
}

.detail .detaillist .right .item .btn span {
  display: inline-block;
  width: 24px;
  height: 24px;
  text-align: center;
  line-height: 24px;
  color: azure;
  background: skyblue;
  border-radius: 50px;
}

.detail .detaillist .right .item .img {
  width: 80px;
  height: 80px;
}

.detail .detaillist .right .item .text {
  padding: 3px 10px;
  flex: 1;
  text-align: left;
}

.detail .detaillist .right .item .text .price {
  color: red;
}

.detail .detaillist .right .item .text .xq {
  font-size: 12px;
}

.wodedz {
  width: 100%;
  height: 100%;
}

.wodedz .wlist {
  height: 567px;
  width: 100%;
}

.wodedz .wlist .item {
  width: 100%;
  position: relative;
  width: 100%;
  display: flex;
  padding: 5px;
  line-height: 30px;
  border-bottom: 1px solid #ccc;
}

.wodedz .wlist .item .redact {
  position: absolute;
  right: 20px;
}

.wodedz .wlist .item .redact img {
  width: 20px;
}

.wodedz .wlist .item .top, .wodedz .wlist .item .foot {
  width: 100%;
  overflow: auto;
}

.wodedz .wlist .ac {
  border-bottom: 2px solid red;
}

.wodedz .addAddress {
  width: 100%;
  height: 50px;
  text-align: center;
  line-height: 50px;
  background: skyblue;
}

.add, .redactaddress {
  width: 100%;
  height: 100%;
}

.add .list, .redactaddress .list {
  width: 100%;
  height: 617px;
}

.add .list div, .redactaddress .list div {
  padding: 10px 20px;
}

.add .list input, .redactaddress .list input {
  border: none;
  border-bottom: 1px solid #000;
  outline: none;
}

.add .btn, .redactaddress .btn {
  display: flex;
  justify-content: space-around;
}

.add .btn div, .redactaddress .btn div {
  background: #ccc;
}

.listin, .wdlist {
  text-align: center;
  line-height: 567px;
}

.listin img {
  width: 375px;
}
